<template>
  <el-card class="box-card">
    <template #header>
      <div class="card-header">
        <div style="font-size: 18px">用户测评设置记录</div>
      </div>
    </template>
    <div class="count">
      <div>可修改配置会员查看测评报考的使用权限</div>
      <el-radio-group v-model="data.type" @change="">
        <el-radio value="1" size="large">普通权限</el-radio>
        <el-radio value="2" size="large">会员卡</el-radio>
      </el-radio-group>
      <el-checkbox-group v-model="data.checkList" v-if="data.type == 1">
        <el-checkbox label="Option A" value="1">查看推荐专业</el-checkbox>
        <el-checkbox label="Option B" value="2">下载测评报告</el-checkbox>
      </el-checkbox-group>
      <el-button type="primary" class="saveBtn" @click="saveBtn">
        保存
      </el-button>
    </div>
  </el-card>
</template>
<script setup>
import { cepingauthApi } from '@/api/system/cePingSetting';
import { ref, onMounted } from 'vue';
import { ElMessage } from 'element-plus';
const data = ref({ type: '', checkList: [] });

const getCepingauth = async (params, type) => {
  const res = await cepingauthApi(params);
  if (type == '保存') {
    ElMessage({
      message: data.msg,
      type: 'success',
    });
  }
  Object.assign(data.value, JSON.parse(res.data.data));
  // data.value = JSON.parse(data.data);
  console.log(JSON.parse(res.data.data));
};

const saveBtn = () => {
  if (!data.value.type && data.value.checkList.length <= 0) return;

  getCepingauth({ data: JSON.stringify(data.value) }, '保存');
};
onMounted(() => {
  getCepingauth();
});
</script>
<style lang="scss" scoped>
.count {
  display: flex;
  flex-direction: column;
  gap: 30px;
  .saveBtn {
    width: 150px;
  }
}
</style>
